*{
	padding:0;
	margin: 0;
}
a{
	color: #dcb5ca;
	text-decoration:none;
	cursor:pointer;
}
a:link { 
color: #dcb5ca; 
text-decoration: none; 
} 
a:visited { 
color: #dcb5ca; 
text-decoration: none; 
} 
a:hover {
color: #dcb5ca; 
text-decoration: underline; 
} 
.zn{
	width: 100%;
}
.top-img{
	width: 100%;	
}
.flex-container {
    display: -webkit-flex;
    display: flex;
    width: 100%;
}

.flex-item {
    background-image: url(../img/yun.png);
    background-size: 100%;
    background-position:3%;
   /*background: red;*/
    width: 25%;
    height:10vw;
    margin-left: 6.5%;
    margin-bottom: 6%;
    /*border-radius: 25px;*/
    text-align: center;
    line-height:10vw ;
    color: #dcb5ca;
    font-weight: bold;
    cursor:pointer;
    font-size: 3vw;
    position:relative;
    animation:myfirst 2s;
	-webkit-animation:myfirst 2s infinite; /* Safari and Chrome */
}
.school1{
	margin-top:-115%;
}
@keyframes myfirst
{
	0%   { left:0px; top:0px;}
	10%   { left:0.2%; top:0px;}
	20%  { left:0.4%; top:0px;}
	30%   { left:0.6%; top:0px;}
	40%   { left:0.8%; top:0px;}
	50%  { left:1%; top:0px;}
	60%   { left:0.8%; top:0px;}
	70%   { left:0.6%; top:0px;}
	80%   { left:0.4%; top:0px;}
	90%   { left:0.2%; top:0px;}
	100% { left:0px; top:0px;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
	0%   { left:0px; top:0px;}
	10%   { left:0.2%; top:0px;}
	20%  { left:0.4%; top:0px;}
	30%   { left:0.6%; top:0px;}
	40%   { left:0.8%; top:0px;}
	50%  { left:1%; top:0px;}
	60%   { left:0.8%; top:0px;}
	70%   { left:0.6%; top:0px;}
	80%   { left:0.4%; top:0px;}
	90%   { left:0.2%; top:0px;}
	100% { left:0px; top:0px;}
}
